{extend name="$lake_admin_layout"/}

{block name="main"}
<div class="layui-card">
    <div class="layui-card-header layui-bg-cyan">栏目管理</div>
    <div class="layui-card-body">
        <blockquote class="layui-elem-quote">
            <form class="layui-form lake-admin-search-form" method="get" lay-filter="lake-admin-search-from">
                <div class="layui-inline">
                    <select name="field" class="lake-admin-search-field">
                        <option value="">全部</option>
                        <option value="name">标识</option>
                        <option value="title">标题</option>
                    </select>
                </div>
                <div class="layui-inline">
                    <input type="text" name="keyword" class="layui-input lake-admin-search-val" placeholder="请输入关键字">
                </div>
                <div class="layui-inline">
                    <a class="layui-btn lake-admin-search-btn" data-type="search">搜索</a>
                </div>
                <div class="layui-inline">
                    <a class="layui-btn" href="{:url('all')}">查看全部</a>
                </div>
            </form>
        </blockquote>
        
        <table class="layui-hide" id="table" lay-filter="table"></table>
    </div>
</div>

<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn-sm layui-iframe" href="{:url('add')}" title="添加栏目">添加栏目</a>
        <a class="layui-btn layui-btn-sm layui-btn-normal" href="{:url('index')}">栏目列表</a>
    </div>
</script>
<script type="text/html" id="actionTpl">
    <a href='{:url("setting")}?id={{ d.id }}' class="layui-btn layui-btn-xs layui-btn-normal layui-iframe" title="栏目设置【{{ d.title }}】">设置</a>
    <a href="{:url('add')}?parentid={{ d.id }}" class="layui-btn layui-btn-xs layui-btn-normal layui-iframe" title="添加栏目">添加</a>
    <a href='{:url("edit")}?id={{ d.id }}' class="layui-btn layui-btn-xs layui-iframe" title="编辑栏目【{{ d.title }}】">编辑</a>
    <a href='{:url("delete")}?id={{ d.id }}' class="layui-btn layui-btn-danger layui-btn-xs layui-tr-del">删除</a>
</script>

<script type="text/html" id="statusTpl">
    <input type="checkbox" name="status" data-href="{:url('state')}?id={{d.id}}" value="{{d.id}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="switchStatus" {{ d.status==1 ? 'checked' : '' }}>
</script>

<script type="text/html" id="modelTpl">
    <span class="layui-badge layui-bg-gray">
        {{ d.model.title }}
    </span>
</script>

<script type="text/html" id="urlTpl">
    <a href="{{ d.url }}" target="_blank">
        <i class="iconfont icon-lianjie"></i>
    </a>
</script>

<script type="text/html" id="createTimeTpl">
    {{ layui.util.toDateString(d.create_time * 1000) }}
</script>
{/block}

{block name="script"}
<script>
layui.use(['table', 'notice'], function() {
    var table = layui.table,
        $ = layui.$,
        notice = layui.notice,
        form = layui.form;
        
    table.render({
        elem: '#table',
        toolbar: '#toolbar',
        url: '{:url("index")}',
        cols: [
            [
                { field: 'id', width: 80, title: '#', align: "center" },
                { field: 'name', width:130, title: '标识' },
                { field: 'title', title: '栏目名称' },
                { width: 100, title: '所属模型', align: "center", templet: '#modelTpl' },
                { field: 'url', width: 60,align:"center", title: 'URL', templet:'#urlTpl'},
                { field: 'sort', width:80, title: '排序', align: "center", edit: 'text' },
                { field: 'create_time', width:160, title: '创建时间', templet: '#createTimeTpl' },
                { field: 'status', width: 100, title: '状态', align: "center", templet: '#statusTpl', unresize: true },
                { fixed: 'right', title: '操作', width: 210, templet: '#actionTpl' }
            ]
        ]
    });
    
    // 搜索
    $(".lake-admin-search-btn").on("click", function() {
        table.reload("table", {
            page: {
                curr: 1
            },
            where: {
                search_field: $(".lake-admin-search-field").val(),
                keyword: $(".lake-admin-search-val").val(),
            }
        })
    });
    
    // 监听单元格编辑
    table.on('edit(table)', function(obj) {
        var value = obj.value,
            data = obj.data;
        $.post('{:url("sort")}', { 'id': data.id, 'value': value }, function(data) {
            if (data.code == 1) {
                notice.success(data.msg);
            } else {
                notice.warning(data.msg);
            }

        })
    });

});
</script>
{/block}